<template>
	<div id="t">
		<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
			<el-menu-item index="1">乐天主页</el-menu-item>
			<el-submenu index="2">
				<template slot="title">我的乐天</template>
				<el-menu-item index="2-1">待处理订单</el-menu-item>
				<el-menu-item index="2-2">我的关注</el-menu-item>
				<el-menu-item index="2-3">我的优惠券</el-menu-item>
				<el-submenu index="2-4">
				<template slot="title">客服服务</template>
				<el-menu-item index="2-4-1">帮助中心</el-menu-item>
				<el-menu-item index="2-4-2">企业客服</el-menu-item>
				<el-menu-item index="2-4-3">电话客服</el-menu-item>
				</el-submenu>
			</el-submenu>
			<el-menu-item index="3" >消息中心</el-menu-item>
			<el-menu-item index="4"><a href="./zhuce.html" target="_blank">免费注册</a></el-menu-item>
		</el-menu>
		<div class="line"></div>
		<!-- <el-menu
			:default-active="activeIndex2"
			class="el-menu-demo"
			mode="horizontal"
			@select="handleSelect"
			background-color="#545c64"
			text-color="#fff"
			active-text-color="#ffd04b">
			<el-menu-item index="1">处理中心</el-menu-item>
			<el-submenu index="2">
				<template slot="title">我的工作台</template>
				<el-menu-item index="2-1">选项1</el-menu-item>
				<el-menu-item index="2-2">选项2</el-menu-item>
				<el-menu-item index="2-3">选项3</el-menu-item>
				<el-submenu index="2-4">
				<template slot="title">选项4</template>
				<el-menu-item index="2-4-1">选项1</el-menu-item>
				<el-menu-item index="2-4-2">选项2</el-menu-item>
				<el-menu-item index="2-4-3">选项3</el-menu-item>
				</el-submenu>
			</el-submenu>
			<el-menu-item index="3" disabled>消息中心</el-menu-item>
			<el-menu-item index="4"><a href="https://www.ele.me" target="_blank">订单管理</a></el-menu-item>
		</el-menu> -->
		
	</div>
</template>

<script>
	export default {
	name: 'top',
	data(){
		return {
				activeIndex: '1',
				activeIndex2: '1'
				};
	},
	methods:{
			handleSelect(key, keyPath) {
				console.log(key, keyPath);
			}
	},
	props: {
	counter: String
	}
	}
</script>

<style>
	el-menu{
		float:right
	}
	a{
		text-decoration:none;
	}
	a:link {color: red} /* 未访问的链接 */
	a:visited {color: red} /* 已访问的链接 */
	a:hover {color: darkred} /* 鼠标移动到链接上 */
	a:active {color: darkred}
	li{
		float: right;
		margin-right: 50px;
		list-style-type: none;
	}
	*{
		padding: 0;
		margin: 0;
	}
	#t{
		height: 25px;
		width: 100%;
		background-color:gray;
		
		
	}
</style>
